<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>修改提交的作业</title>
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <link rel="stylesheet" href="../../../resources/layuiadmin/layui/css/layui.css">
  <link rel="stylesheet" href="../../../resources/css/global.css">
</head>
<body>

<div class="fly-header layui-bg-black">
  <div class="layui-container">
    <a class="fly-logo">
      <img src="../../../resources/img/logo.png" alt="layui">
    </a>
    <ul class="layui-nav fly-nav layui-hide-xs">
      <li class="layui-nav-item layui-this">
        <a class="student-index"><i class="iconfont icon-jiaoliu"></i>超行作业通-学生界面</a>
      </li>
    </ul>
    <ul class="layui-nav fly-nav-user">
      <li class="layui-nav-item">
        <a class="fly-nav-avatar" href="javascript:;">
          <cite class="layui-hide-xs" id="cite-name"></cite>
          <i class="iconfont icon-renzheng layui-hide-xs" title="认证信息：学生"></i>
          <img src="" alt="" id="profileImg">
        </a>
        <dl class="layui-nav-child">
          <dd><a href="/student/set"><i class="layui-icon">&#xe620;</i>基本设置</a></dd>
          <dd><a class="student-index"><i class="layui-icon" style="margin-left: 2px; font-size: 22px;">&#xe68e;</i>我的主页</a></dd>
          <hr style="margin: 5px 0;">
          <dd><a href="/home/logout" style="text-align: center;">退出</a></dd>
        </dl>
      </li>
    </ul>
  </div>
</div>

<div class="layui-hide-xs">
  <div class="fly-panel fly-column">
    <div class="layui-container">
      <ul class="layui-clear">
        <li><a class="student-index">首页</a></li>
        <li><a href="/student/course">选课列表</a></li>
        <li class="layui-this"><a class="studentHomework-list">作业提交情况</a></li>
        <li class="layui-hide-xs layui-hide-sm layui-show-md-inline-block"><span class="fly-mid"></span></li>
      </ul>

      <div class="fly-column-right layui-hide-xs">
        <a href="" class="layui-btn">提交作业</a>
      </div>
    </div>
  </div>
</div>

<div class="layui-container fly-marginTop">
  <span class="layui-breadcrumb">
    <a class="studentHomework-list">作业提交情况</a>
    <a id="studentHomework-info">提交作业详情</a>
    <a><cite>修改提交的作业</cite></a>
  </span>
  <div class="fly-panel" pad20 style="padding-top: 5px;">
    <div class="layui-form layui-form-pane">
      <div class="layui-tab layui-tab-brief">
        <ul class="layui-tab-title">
          <li class="layui-this">修改作业</li>
        </ul>
        <div class="layui-form layui-tab-content" style="padding: 20px 0;">
          <div class="layui-tab-item layui-show">
            <form action="" lay-filter="modify-StudentHomeworkInfo">
              <input type="hidden" id="input-studentId">
              <div class="layui-form-item layui-col-md6">
                <label class="layui-form-label">学生作业ID</label>
                <div class="layui-input-block">
                  <input type="text" class="layui-input" name="studentHomeworkId" readonly>
                </div>
              </div>
              <div class="layui-form-item layui-col-md6">
                <label class="layui-form-label">作业ID</label>
                <div class="layui-input-block">
                  <input type="text" class="layui-input" name="homeworkId" readonly>
                </div>
              </div>
              <div class="layui-form-item layui-col-md9">
                <label class="layui-form-label">作业标题</label>
                <div class="layui-input-block">
                  <input type="text" class="layui-input" name="homeworkName" readonly>
                </div>
              </div>
              <div class="layui-form-item layui-form-text">
                <label class="layui-form-label">作业要求</label>
                <div class="layui-input-block">
                  <textarea placeholder="" name="homeworkDesc" autocomplete="off" class="layui-textarea" style="height: 80px;"></textarea>
                </div>
              </div>
              <div class="layui-form-item layui-form-text">
                <label class="layui-form-label">提交内容</label>
                <div class="layui-input-block">
                  <textarea placeholder="" name="submitContent" autocomplete="off" class="layui-textarea" style="height: 80px;"></textarea>
                </div>
              </div>
              <div class="layui-form-item">
                <label class="layui-form-label">提交文件</label>
                <div class="layui-input-inline">
                  <input type="file" name="submitFile">
                </div>
              </div>
              <div class="layui-form-item">
                <button class="layui-btn" lay-submit="" lay-filter="modify-studentHomework">修改</button>
              </div>
            </form>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

<div class="fly-footer">
  <p>超行作业通 2021 &copy; <a target="_blank">By 软件工程小组</a></p>
</div>

<script src="../../../resources/layuiadmin/layui/layui.js"></script>
<script src="../../../resources/js/common.js"></script>
<script>
  layui.use(['element', 'form'], function(){
    var $ = layui.jquery
            ,form = layui.form
            ,layer = layui.layer;

    //获取一段url中的字段
    //如loacalhost:8080?courseId=1，getQueryString('courseId')则获取url中courseId的值
    var studentHomeworkId = getQueryString('studentHomeworkId');

    $('#studentHomework-info').attr('href','/student/studentHomeworkInfo?studentHomeworkId='+studentHomeworkId);

    //访问后台，获取学生信息
    $.getJSON('/student/getStudentInfo', function(data) {
      if (data.success) {
        //获取后台传递过来的教师信息
        var student = data.student;

        //判断从后台传入的图片流是否为空，
        //如果为空，给img标签添加noImage的图片路径
        //如果不为空，给img标签添加后台传入的图片路径
        if (student.profileImg != null){
          $('#profileImg').attr('src', student.profileImg);
        }else {
          $('#profileImg').attr('src', 'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1597852452753&di=a753cb97410d9e6d3e312f303c326fdb&imgtype=0&src=http%3A%2F%2Fku.90sjimg.com%2Felement_origin_min_pic%2F01%2F38%2F98%2F25573ca2525d341.jpg');
        }

        //根据name、Id或Class名称为相应标签里的内容添加值
        //html-替换标签里的内容
        //append-在标签原有内容的末尾添加新的内容
        //attr-给标签添加新的属性值
        $('#cite-name').html(student.studentName);
        $('#input-studentId').val(student.studentId);
        $('.studentHomework-list').attr('href','/student/studentHomeworkList?studentId=' + student.studentId);
        $('.student-index').attr('href', '/student/index?studentId=' + student.studentId);
      }
    });

    //表单渲染（必需的操作），需要在form标签里面添加lay-filter=''
    form.render(null, 'modify-StudentHomeworkInfo');

    //访问后台，获取学生作业信息，并给表单元素赋值
    $.getJSON('/student/getStudentHomeworkById?studentHomeworkId='+studentHomeworkId, function (data){
      if (data.success) {
        //获取后台传递过来的学生作业信息
        var studentHomework = data.studentHomework;

        $('textarea[name="submitContent"]').val(studentHomework.submitContent);
        $('textarea[name="homeworkDesc"]').val(studentHomework.homework.homeworkDesc);
        $('input[name="studentHomeworkId"]').val(studentHomework.studentHomeworkId);
        $('input[name="homeworkId"]').val(studentHomework.homework.homeworkId);
        $('input[name="homeworkName"]').val(studentHomework.homework.homeworkName);
      }
    });

    //定义studentHomework对象（Object）
    var studentHomework = {};

    //监听表单提交
    form.on('submit(modify-studentHomework)', function(data){
      //获取表单内所有标签的值

      //获取文件流
      var studentHomeworkFile = $('input[name="submitFile"]')[0].files[0];

      studentHomework.studentHomeworkId = $('input[name="studentHomeworkId"]').val();
      studentHomework.submitContent = $('textarea[name="submitContent"]').val();
      studentHomework.student = {
        studentId : $('#input-studentId').val()
      };
      studentHomework.homework = {
        homeworkId : $('input[name="homeworkId"]').val()
      };

      var formData = new FormData();
      formData.append('studentHomeworkFile', studentHomeworkFile);
      formData.append('studentHomeworkStr',JSON.stringify(studentHomework));

      //用ajax时需要注意你的url接口、采用哪一种方式type获取，它的使用的哪种数据类型datatype
      $.ajax({
        url:'/student/modifyStudentHomework',
        type:'post',
        data:formData,
        contentType : false,
        processData : false,
        success:function(res){
          if (res.success){
            layer.msg("修改成功");
          }else {
            layer.msg("修改失败" + res.errMsg);
          }
        }
      })
      return false;
    });

  });
</script>

</body>
</html>